<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    // 面向过程 => 分析解决问题需要的步骤 然后通过变量和函数实现,使用时依次调用即可

    // 面向对象 => 将需求抽象成对象,然后针对这个对象分析特性和行为  (把构成问题的事物抽象为对象)


    function Cat(name, color) {
        // {}
        // {}[[Prototype]] = Cat.prototype;  (给每一个创建的实例化对象绑定原型属性 [[Prototype]] -> 指向构造函数的原型对象  -> 浅复制)
        // this -> {}

        this.name = name;
        this.color = color;

        // return this;    // {name,color,[[Prototype]]:Cat.prototype}
    }

    console.dir(Cat);

    // 构造函数的原型对象  =>  用于存放所有实例化对象公有的属性和方法  => 所有的实例化对象都可以访问
    // Cat.prototype = { constructor:Cat }

    Cat.prototype.species = "Cat";  // 公有属性
    Cat.prototype.call = function () { // 公有方法
        console.log("喵喵");
    }
    Cat.prototype.say = function () {  // 实例化对象.say();
        // this -> 调用此方法的实例化对象
        console.log(this.name, this.color);
    }

    var Tom = new Cat("Tom", "black");
    console.log(Tom);


    console.log(Tom.name, Tom.color);
    console.log(Tom.species);
    console.log(Tom.call);
    console.log(Tom.say);

    Tom.call()
    Tom.say(); // this -> Tom



</script>

</html>